<template>
	<view style="height: 100%;">

<!-- 		<u-navbar :placeholder="true" title="优惠券" :titleStyle="{color:'#ffffff'}" :bgColor="background" :border="false">
			<view slot="left">
			</view>
		</u-navbar> -->

		<v-tabs v-model="current" :scroll="false" :tabs="tabs" @change="changeTab" activeColor="#C0191F"
			lineColor="#C0191F">
		</v-tabs>


		<view class="content-list">
			<view style="padding: 20rpx;">
				<nx-coupon :status="current" @showrule="showrule" v-for="(item, index) in couponList" :key="index"
					:item="item" />
			</view>

			<view style="height: 80vh;" class="x-c" v-if="couponList.length === 0">

				<kevy-empty :show="true" type="goods" text="这里空空如也~"></kevy-empty>
<!-- 				<u-empty text="暂无数据" icon-size="40"></u-empty> -->
			</view>

		</view>

		<nx-coupon-rule ref="couponRule" v-if="couponShowRule" :itemData="itemData" :ruleShow="couponShowRule">
		</nx-coupon-rule>
	</view>
</template>

<script>

	export default {
		components: {},
		onShow() {
			// 查询优惠券
		},
		filters: {

		},
		data() {
			return {
				itemData: {},
				couponShowRule: false,
				couponList: [

				],
				searchQuery: {
					type: 0, // 0未使用 1已使用 2 已失效
				},
				current: 0,
				tabs: ['未使用', '已使用', '已失效'],
				background: '#C0191F',
				couponData: {
					useList: [], // 未使用
					HaveUseList:[], // 已使用
					stopList: [], // 已失效
				},

			}
		},
		onLoad(option) {
			// 监听优惠券勾选
			this.CouponUserList(1)
			this.CouponUserList(2)
			this.CouponUserList(3)
			
		},
		methods: {
			
			CouponUserList(type) {
				let url = this.$api.CouponUserList + '?type=' + type
				this.$request(url, null, "GET",
						false).then(res => {
						if (res.code == 200) {
			
							res.data.forEach(item => {
			
								// {
								// 	couponName: '1118-4',
								// 	couponSn: 'Y1483348124452782092',
								// 	discountsMaxAmount: '50.00',
								// 	discountsMinAmount: '1500.00',
								// 	exchangeEndDate: '2022-01-21 15:58:47',
								// 	exchangeStartDate: '2022-01-18 15:58:47',
								// 	id: '1483348124657315841',
								// 	isAdditivity: 1,
								// 	source: 0,
								// 	type: 0
								// },
			
								if (item.type == "offerMinusCoupons") {
									// 满减券
									let ruleFieldL = item.ruleField.split(":")
									item.operationType = item.thresholdUnit
									item.discountsMaxAmount = ruleFieldL[1]
									if (ruleFieldL[0] != 0)
										item.discountsMinAmount = ruleFieldL[0]
								} else if (item.type == "offerFoldCoupons") {
									item.operationType = item.thresholdUnit
									// 折扣券
									let ruleFieldL = item.ruleField.split(":")
									item.discountsMaxAmount = Number(ruleFieldL[1]) * 10
									if (ruleFieldL[0] != 0)
										item.discountsMinAmount = ruleFieldL[0]
								} else if (item.type == "offerCoinCoupons") {
									item.goodsName = item.operationType
									item.num = item.ruleField
								}
								item.isAdditivity = 0
			
								item.source = item.activityName
								item.exchangeEndDate = item.expireTime
								item.exchangeStartDate = item.originTime
							})
			
							if (type == 1) {
								// 未使用
								this.couponData.useList = res.data
								this.couponList = res.data
							} else if (type == 3) {
								// 已失效
								this.couponData.stopList = res.data
							}else if (type == 2) {
								// 已失效
								this.couponData.HaveUseList = res.data
							}
			
							// 赋值且给checkbox给默认值
							this.couponData.useList = this.couponData.useList.map((item) => {
								let obj = {
									...item,
									checked: false, // 勾选
									topRightTip: false, //右上角提示
									bottomTip: false // 底部提示
								}
								return obj
							})
			
							let that = this
							if (this.$refs.picCoupon) {
								this.$refs.picCoupon.setUseData(that.couponData.useList)
								this.$refs.picCoupon.setStopList(that.couponData.stopList)
							}
							this.$forceUpdate()
						} else {
							uni.showToast({
								title: res.description,
								icon: 'error'
							});
						}
					})
					.catch(res => {
						uni.hideLoading();
					})
			},
			
			showrule(item) {
				let that = this;
				this.couponShowRule = true;
				this.itemData = item;
				if (that.$refs.couponRule) {
					that.$refs.couponRule.ruleShowOrClose();
				}
			},
			// 获取优惠券
			async getCoupon() {
				let parms = {
					type: this.searchQuery.type
				}
				// let data = await this.$get(this.$api.person.couponList, parms, true);
				// if (data) {
				// 	this.couponList = data;
				// }
					this.couponList = this.couponList.map(item=>{
						let obj = item;
						obj.type = this.searchQuery.type
						return obj
					});
			},
			changeTab(index) {
				console.log('index', index)
				this.couponTab = index
				this.searchQuery.type = index;
				this.current = index;
				let type;
				if (this.couponTab == 0){
					type = 1
					this.couponList =this.couponData.useList
				}
				else if (this.couponTab == 1){
					type = 3
					this.couponList =this.couponData.HaveUseList
				}
				else{
					type = 2
					this.couponList =this.couponData.stopList
				}
			},
			// changeTab(index) {
			// 	this.searchQuery.type = index;
			// 	this.current = index;
			// 	// 查询优惠券
			// 	this.getCoupon();
			// }
		}
	}
</script>

<style lang="scss" scoped>
	// .scroll-view-item_wrap {
	// 	min-width: 140rpx;
	// 	text-align: center;
	// 	line-height: 60rpx;
	// 	font-size: 25rpx;
	// 	border-radius: 32rpx;
	// 	margin: 20rpx 0 0 30rpx;
	// }
</style>
